<!DOCTYPE html>
<html lang="en">
<head>
	<title>登录</title>
		<meta http-equiv="Expires" CONTENT="0">
		<meta http-equiv="Cache-Control" CONTENT="no-cache">
		<meta http-equiv="Pragma" CONTENT="no-cache">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="renderer" content="webkit">
		<%include("/common/include.html"){}%>
	<link rel="stylesheet" type="text/css" href="${cxt!}/sb/css/bootstrap.min.css">
	<link href="${cxt!}/sb/css/login.css" type="text/css" rel="stylesheet">
	
	<script type="text/javascript" src="${cxt!}/sb/js/bootstrap.min.js"></script>
</head>
<style>
.l-btn-text{
color:#07379f
}
html, body, a, a:link, a:visited, a:hover, a:active, select, input, label, button, textarea, h1, h2, h3, h4, h5, h6{
color:#fff;
}
.window .window-body{
color:#000;
}
.window .window-header .panel-title{
color:#444;
}
.form-control{
width:83%;
}
.radio, .checkbox{
margin-top:5px;
margin-bottom:5px;
}
.form-control{
height:30px;
}
</style>
<body>
	<!-- <div id="nav">
		<img src="${cxt!}/sb/img/logo.png">
	</div> -->
	<!-- <div data-options="region:'north',border: false" style="height: 97px; overflow: hidden;">
			<img src="${cxt!}/sb/img/head.png" / style="width: 100%;height: 97px;" >
		</div> -->
	<div id="section">
		<div id="rt" style="margin-top:-0.7%;">
			<!-- <h2>登&nbsp;&nbsp;录</h2> -->
			<!-- <div><img src="${cxt!}/sb/img/top.png" style="margin-left:15%"></div> -->
			<form id="loginForm" action="${cxt!}/login/vali" method="post">
			  <div class="form-group">
			    <label for="exampleInputEmail1" class="lf account" >账号：</label>
			    <input type="text" class="form-control lf" placeholder="账号" id="login_username" name="username" value="${cookieMap.userName.value!}">
			  </div>
			  <div class="clear"></div>
			  <div class="form-group" style="margin-top:4%;">
			    <label for="exampleInputPassword1" class="lf account">密码：</label>
			    <input type="password" class="form-control lf" placeholder="密码" id="login_password"
						name="password">
			  </div>
			  <div class="clear"></div>
			  <div class="form-group" style="margin-top:4%;">
			    <label for="exampleInputPassword1" class="lf account">验证码：
			    	
				</label>
				<input type="text" id="login_authCode" name="authCode" class="form-control lf" style="width:40%; " placeholder="验证码">
				
				<!-- <img id="yanZhengMa"  src="${cxt!}/authImg?rand=' + Math.random() + '"   onclick="showImage(this);"    width="120" height="40" style="margin-left:17px; height: 30px;"/> -->
				
			  <label class="lf"><a href="javascript:void(0)" id="login_authCodeHref" onclick="showImage(this);"></a></label> 
				
				
			  </div>
			  <div class="clear"></div>
			 <!--  <div class="checkbox">
			    <label>
			    	<input type="checkbox" id="remember" name="remember" value="1" style="height:15px;margin-top: 2px;">自动登录
			    </label>
			    <label>
			      <a href="" style="color:#000">忘记密码</a>
			    </label>
			  </div> -->
			  <a class="btn btn-default" onclick="submitFunc();" style="margin-top:15px;">登&nbsp;&nbsp;录</a>
			</form>
		</div>
	
	<!-- <div id="footer_box">
		<p style="height:30%;"></p>
		<p>
			<b style="color:#fff;">技术支持：山西星羽云网络科技有限公司</b><br>
			<b style="color:#fff;">电话：0351-7232123</b><br>
			<b style="color:red;font-family:'楷体'">（最佳分辨率：1600*900）</b>
		</p>
		<p>
			<b style="color:red;font-family:'楷体'">系统支持谷歌浏览器，IE9以上版本，推荐使用谷歌浏览器<a style="color:#fff;font-family:'楷体'" href="Chrome.exe">下载谷歌浏览器</a></b>
		</p>
	</div> -->
	</div>
	<script type="text/javascript">
	
	function showImage(node) {
		var imageHtml = '<img id="yanZhengMa" src="${cxt!}/authImg?rand=' + Math.random() + '" width="120" height="40" style="margin-left:17px; height: 30px;"/>';
		$(node).html(imageHtml);
	}
	
	showImage($("#login_authCodeHref"));
	
	
	function submitFunc(){
		// 验证账号是否存在
		var userName = $("#login_username").val();
		if (userName == "") {
			$.messager.alert('提示', "请输入登录账号", 'info');
			return;
		}
		var userName = $("#login_password").val();
		if (userName == "") {
			$.messager.alert('提示', "请输入密码", 'info');
			return;
		}
		var userName = $("#login_authCode").val();
		if (userName == "") {
			$.messager.alert('提示', "请输入验证码", 'info');
			return;
		}
		var user = $("#login_username").val();
		// 提交表单
		var $form = $("#loginForm");
		$.post('${cxt!}/login/vali', $("#loginForm").serialize(), function(result) {
			if(result.code == '300'){
				showImage($("#login_authCodeHref"));
				$.messager.alert('错误', result.msg, 'error');
			}else if(result.code == '200'){
				window.location.href="${cxt!}/index";
			}else {
				loadDialog(null, null, '修改密码', '${cxt !}/personalInformation/alterLogin?userName=' +user,350,550);
			}
		});
	}
	
	
	
	
		//页面加载时
		window.onload = function(){
			var sheight = $("#section").height();
			var swidth = $("#section").width();
			var rheight = $("#rt").height();
			var padding=(sheight-rheight)/2;
			$("#rt").css("top",padding+"px");
			if(sheight<476){
				var section=document.getElementById("section");
				var rt=document.getElementById("rt");
				section.style.height="577px";
				rt.style.top="63px";
			}
			if(swidth<1020){
				var nav=document.getElementById("nav");
				var section=document.getElementById("section");
				section.style.width="1600px";
				nav.style.width="1600px";
			}
		}	
		//窗口大小改变时
		window.onresize = function(){
			var sheight = $("#section").height();
			var swidth = $("#section").width();
			var rheight = $("#rt").height();
			var padding=(sheight-rheight)/2;
			$("#rt").css("top",padding+"px");
			if(sheight<476){
				var section=document.getElementById("section");
				var rt=document.getElementById("rt");
				section.style.height="577px";
				rt.style.top="63px";
			}
			if(swidth<1020){
				var nav=document.getElementById("nav");
				var section=document.getElementById("section");
				section.style.width="1600px";
				nav.style.width="1600px";
			}
		}		
		
		


		jQuery(document).ready(function() {
			
			// 初始化页面焦点
			var userName = $("#login_username");
			var passWord = $("#login_password");
			if (userName.val() == "") {
				userName.focus();
			} else if (passWord.val() == "") {
				passWord.focus();
			} else {
				$("#login_authCode").focus();
			}

			

			// 键盘回车事件
			var tds = $("html");
			tds.keydown(function(event) {
				var myEvent = event || window.event; //解决不同浏览器获取事件对象的差异
				switch (myEvent.keyCode) {
				case 13://回车事件
					submitFunc();
					break;
				}
			});
		});

	</script>
</body>
</html>